<template>
    <div class="f" style="margin-left: 8px; cursor: pointer">
        <a-tooltip placement="right" title="打开新页面">
            <split class="f" @click="add()" theme="outline" size="16" fill="#889eff" :strokeWidth="2" />
        </a-tooltip>
    </div>
</template>
<script setup>
import { Split } from "@icon-park/vue-next"
import { inject, onMounted, watch } from "vue"
import { debounceRef } from "@/utils/common"
const globalVars = inject("globalVars")
const props = defineProps({
    title: String,
    ckey: String,
})
const lock = debounceRef(0, 300)

function add() {
    lock.value += 1
}
watch(
    () => lock.value,
    () => {
        newTab()
    },
)

function newTab() {
    globalVars.addPane(props.ckey, props.title, true, true)
}
</script>
